<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Document</title>
  	<link rel="stylesheet" href="./../css/style.css">
	<link rel="stylesheet" href="./../css/fullpage.css">	
	<link rel="stylesheet" href="./../css/index.css">
	<script src='./../js/jquery-3.3.1.min.js'></script>
	<script src='./../js/fullpage.js'></script>
	<script src="./../js/easings.js"></script>
	<script src="./../js/scrolloverflow.js"></script>
	<script src="./../js/base.js"></script>
	<script src="./../js/index.js"></script>
</head>
<body>
<div id="fullpage">
	<header id="header" class="transiti">
		<div class="header-wrap">
			<div class="logo transiti">
				<a href="#" class="link-wrap">
					<svg class="" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.55 135"><defs><style>.cls-1{fill:#d9d9d9;}.cls-2{fill:#dfdfdf;}.cls-3{fill:#e6e6e6;}.cls-4{fill:#f0f0f0;}</style></defs><title>资源 1</title><g id="图层_2" data-name="图层 2"><g id="图层_1-2" data-name="图层 1"><rect class="cls-1" x="225.54" y="45" width="10.78" height="45"/><polygon class="cls-1" points="167.35 45 167.35 90 178.14 90 178.14 55.78 205.05 55.78 205.05 90 215.84 90 215.84 50.4 210.47 45 167.35 45"/><polygon class="cls-1" points="507.19 45 464.07 45 464.07 90 474.86 90 474.86 55.78 501.77 55.78 501.77 90 512.55 90 512.55 50.4 507.19 45"/><rect class="cls-1" x="303.4" y="45" width="10.78" height="45"/><rect class="cls-1" x="384.38" y="45" width="10.78" height="45"/><polygon class="cls-1" points="282.81 45 282.9 79.36 256.81 79.36 256.81 71.64 246.03 71.64 246.03 85.38 250.71 90 289.01 90 293.7 85.37 293.6 45 282.81 45"/><path class="cls-1" d="M410.11,45l-5.24,5.37V84.85L410.2,90H449l5.34-5.15V50.28L448.9,45Zm33.48,34.36H415.65V55.88h27.94Z"/><path class="cls-1" d="M362.84,45H328.38V55.78h35.51v5.88H329.08L323.89,67V84.83L329.18,90h40.21l5.29-5.17V49.62L370,45Zm1.05,30.83v3.53H334.67V72.29h29.22Z"/><path class="cls-2" d="M100.83,126.21a67.73,67.73,0,0,0,26.59-27.62h0c-7,6.07-15.19,9.64-24.93,11.89C74,117.07,43.78,97.61,39,72.38h0c-.13-.78-.23-1.57-.3-2.36A28.61,28.61,0,0,1,41,56h0c-10,21.74-5.54,57.43,30.54,70.25,9.38,3.48,21.92,3.18,29.29-.05Z"/><path class="cls-3" d="M34.09,8.79A67.76,67.76,0,0,0,7.51,36.41h0C14.09,31,24.2,26.82,34,24.57c27.46-6.34,55.32,14.1,61.19,34.88.28,1,.53,2.1.75,3.17h0c.13.78.24,1.57.31,2.36A30.78,30.78,0,0,1,94,79h0c13.45-22.55.95-58.9-30.54-70.61-13-3.94-23-1.94-29.36.41Z"/><path class="cls-1" d="M32.52,22.83a51.4,51.4,0,0,0-25,13.58h0a67.55,67.55,0,0,0,93.32,89.8h0A52.83,52.83,0,0,1,72.54,124C41.91,112.33,31.38,79.66,41,56h0a29,29,0,0,1,4.38-7.07A28.75,28.75,0,0,1,95.14,59.45C88.05,33,60,16.5,32.52,22.83Z"/><path class="cls-4" d="M102.49,112.12a52.8,52.8,0,0,0,24.93-13.53h0A67.56,67.56,0,0,0,34.1,8.79h0A53.16,53.16,0,0,1,62.47,11C93.1,22.67,103.63,55.34,94,79h0a29,29,0,0,1-4.38,7.07A28.89,28.89,0,0,1,39.78,75.6C46.74,102,75.05,118.46,102.49,112.12Z"/></g></g></svg>
					<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512.55 135"><defs><style>.cls-1{fill:#e0e0e0;}.cls-2{fill:#e6e6e6;}.cls-3{fill:#f5f5f5;}.cls-4{fill:#dedede;}.cls-5{fill:#fcfcfc;}</style></defs><title>资源 2</title><g id="图层_2" data-name="图层 2"><g id="图层_1-2" data-name="图层 1"><rect class="cls-1" x="225.54" y="45" width="10.78" height="45"/><polygon class="cls-1" points="167.35 45 167.35 90 178.14 90 178.14 55.78 205.05 55.78 205.05 90 215.84 90 215.84 50.4 210.47 45 167.35 45"/><polygon class="cls-1" points="507.19 45 464.07 45 464.07 90 474.86 90 474.86 55.78 501.77 55.78 501.77 90 512.55 90 512.55 50.4 507.19 45"/><rect class="cls-1" x="303.4" y="45" width="10.78" height="45"/><rect class="cls-1" x="384.38" y="45" width="10.78" height="45"/><polygon class="cls-1" points="282.81 45 282.9 79.36 256.81 79.36 256.81 71.64 246.03 71.64 246.03 85.38 250.71 90 289.01 90 293.7 85.37 293.6 45 282.81 45"/><path class="cls-1" d="M410.11,45l-5.24,5.37V84.85L410.2,90H449l5.34-5.15V50.28L448.9,45Zm33.48,34.36H415.65V55.88h27.94Z"/><path class="cls-1" d="M362.84,45H328.38V55.78h35.51v5.88H329.08L323.89,67V84.83L329.18,90h40.21l5.29-5.17V49.62L370,45Zm1.05,30.83v3.53H334.67V72.29h29.22Z"/><path class="cls-2" d="M100.83,126.21a67.73,67.73,0,0,0,26.59-27.62h0c-7,6.07-15.19,9.64-24.93,11.89C74,117.07,43.78,97.61,39,72.38h0c-.13-.78-.23-1.57-.3-2.36A28.61,28.61,0,0,1,41,56h0c-10,21.74-5.54,57.43,30.54,70.25,9.38,3.48,21.92,3.18,29.29-.05Z"/><path class="cls-3" d="M34.09,8.79A67.76,67.76,0,0,0,7.51,36.41h0C14.09,31,24.2,26.82,34,24.57c27.46-6.34,55.32,14.1,61.19,34.88.28,1,.53,2.1.75,3.17h0c.13.78.24,1.57.31,2.36A30.78,30.78,0,0,1,94,79h0c13.45-22.55.95-58.9-30.54-70.61-13-3.94-23-1.94-29.36.41Z"/><path class="cls-4" d="M32.52,22.83a51.4,51.4,0,0,0-25,13.58h0a67.55,67.55,0,0,0,93.32,89.8h0A52.83,52.83,0,0,1,72.54,124C41.91,112.33,31.38,79.66,41,56h0a29,29,0,0,1,4.38-7.07A28.75,28.75,0,0,1,95.14,59.45C88.05,33,60,16.5,32.52,22.83Z"/><path class="cls-5" d="M102.49,112.12a52.8,52.8,0,0,0,24.93-13.53h0A67.56,67.56,0,0,0,34.1,8.79h0A53.16,53.16,0,0,1,62.47,11C93.1,22.67,103.63,55.34,94,79h0a29,29,0,0,1-4.38,7.07A28.89,28.89,0,0,1,39.78,75.6C46.74,102,75.05,118.46,102.49,112.12Z"/></g></g></svg>
				</a>
			</div>

			<div class="menu transiti">
				<ul class="clearfix menu-wrap">
					<li class="menu-item link-hover" data-index="0"><a href="#" class="link">案例</a></li>
					<li class="menu-item link-hover" data-index="1"><a href="#" class="link">技术</a></li>
					<li class="menu-item link-hover" data-index="2"><a href="#" class="link">产品</a></li>
					<li class="menu-item"><a href="#" class="link">我们</a></li>
					<li class="menu-item link-hover" data-index="3"><a href="#" class="link">最新</a></li>
				</ul>
			</div>
		</div>

		<i class="line"></i>

		<div class="down-menu-wrap">

			<div class="down-menu">
				<ul class="down-menu-wrap">
					<li class="down-menu-item">
						<a href="#" class="link-wrap">
							<span class="text">菜单标题</span>
						</a>
					</li>
				</ul>
			</div>

			<div class="down-menu">
				<ul class="down-menu-wrap">
					<li class="down-menu-item">
						<a href="#" class="link-wrap">
							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">
							<span class="text">菜单标题</span>
						</a>
					</li>
				</ul>
			</div>

			<div class="down-menu">
				<ul class="down-menu-wrap">
					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

				</ul>
			</div>

			<div class="down-menu">
				<ul class="down-menu-wrap">
					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>

					<li class="down-menu-item">
						<a href="#" class="link-wrap">

							<span class="text">菜单标题</span>
						</a>
					</li>
				</ul>
			</div>
		</div>

		<div class="min-menu-slide">
			<div class="min-menu-ico transiti">
				<i class="line transiti top"></i>
				<i class="line transiti middle"></i>
				<i class="line transiti bottom"></i>
			</div>

			<div class="content">

			</div>
		</div>
	</header>

	<div class="page page1 one">
		<div class="text-box">
			<h2 class="title transiti">
				人居环境空气治理专业技术服务商
			</h2>
			<p class="title-eng transiti eng">
				Air Purification technologies-sevices for domestic and commercial use
			</p>
		</div>

		<div class="slider">
			<ul class="clearfix">
				<li class="slider-item active">

				</li>

				<li class="slider-item">

				</li>

				<li class="slider-item">

				</li>
			</ul>
		</div>
	</div>

	<div class="page page2">
		<div class="top transiti">
			<div class="text-box">
				<h3 class="sub-title"><a href="#" class="link">专业技术</a></h3>
				<p class="title-eng">非对交替发生正负离子技术</a></p>
			</div>

			<div class="pic-list">
				<div class="pic-item">
					<a href="#" class="link-wrap"></a>
					<img src="./../images/pic_item1-1.png" alt="..." />

					<div class="cover transiti">

					</div>

					<span class="text transiti">
						消除空气中 <br />
						的异味
					</span>
				</div>
				<div class="pic-item">
					<a href="#" class="link-wrap"></a>
					<img src="./../images/pic_item2-2.png" alt="..." />

					<div class="cover transiti">

					</div>

					<span class="text transiti">
						杀灭<br />
						细菌、病毒
					</span>
				</div>
				<div class="pic-item">
					<a href="#" class="link-wrap"></a>
					<img src="./../images/pic_item3-3.png" alt="..." />

					<div class="cover transiti">

					</div>

					<span class="text transiti">
						降低空气<br />
						PM2.5 颗粒物
					</span>
				</div>
			</div>
		</div>

		<div class="bottom">
			<h2 class="title animated">工程案例</h2>
		</div>
	</div>

	<div id="footer"  class="page">
		<div class="top">
			<div class="left animate-line">
				<h3 class="sub-title">非对称交替正负离子发生器</h3>
				<p class="eng">N-LZG12<span>型</span></p>
			</div>

			<div class="middle">
				<img src="./../images/video.png" alt="..." />
			</div>

			<div class="right">
				<a href="#" class="btn">了解更多</a>
			</div>
		</div>

		<div class="bottom">
			<div class="footer-menu">
				<ul class="clearfix footer-menu-wrap">
					<li class='footer-menu-item'>
						<a href="#" class="link"><i class="dot"></i>售后</a></li>

					<li class='footer-menu-item'>
						<a href="#" class="link"><i class="dot"></i>联系</a></li>

					<li class='footer-menu-item'>
						<a href="#" class="link"><i class="dot"></i>购买</a></li>

					<li class='footer-menu-item'>
						<a href="#" class="link"><i class="dot"></i>专利</a></li>

					<li class='footer-menu-item'>
						<a href="#" class="link"><i class="dot"></i>我们</a></li>
				</ul>
			</div>

			<div class="footer-ico">
				<a href="#" class="ico-item fa fa-facebook">

				</a>

				<a href="#" class="ico-item fa fa-twitter">

				</a>

				<a href="#" class="ico-item fa fa-wechat">

				</a>

				<a href="#" class="ico-item fa fa-qq">

				</a>
			</div>

			<div class="copy">
				底部版权
			</div>
		</div>
	</div>
</div>
</body>
<script>
  $('#fullpage').fullpage({
    anchors: ['firstPage', 'secondPage', 'thirdPage', 'fourPage'],
    slidesColor: ['#f00', '#0f0', '#00f', 'back'],
    navigation: true,
    navigationColor: 'red',
    showActiveTooltip: true,
    slidesNavigation: true,
    autoScrolling: false,
    loopBottom: false,
    sectionSelector: '.page',
    slideSelector: '.word',
    verticalCentered: false,
    onLeave: function(a, b){
      console.log() // 当前页面下表
      console.log() // 下一页面下表


    },
    afterLoad: function(a, b){
      console.log() // 滚动结束后打印当前Page锚点
      console.log() // 滚动结束后打印当前Page下表

      if(b > 1){
        $('#header').addClass('a').find('.down-menu').addClass('bg').prevObject.find('.logo').find('svg:first-child').addClass('active').next().removeClass('active')
				$('#header').find('.min-menu-ico').addClass('a')
      } else {

        $('#header').removeClass('a').find('.down-menu').removeClass('bg').prevObject.find('.logo').find('svg:first-child + svg').addClass('active').prev().removeClass('active')
        $('#header').find('.min-menu-ico').removeClass('a')
      }
    },
    afterRender: function() {

    },
    afterResize: function(a, b){

    },
    afterSlideLoad: function(a, b){
      console.log() // Slide滚动结束后打印当前Slide锚点
      console.log() // Slide滚动结束后打印当前Slide下表
    },
    onSlideLeave: function(a, b) {

    }
  })
</script>
</html>